import React from 'react';
import PropTypes from 'prop-types';  //类型检查
import {Popconfirm, Table, Button} from 'antd';

const ProductList =({onDelete, products})=>{
    const columns = [
        {
            title: "Name",
            dataIndex: 'name'
        },
        {
            title: 'Actions',
            render: (text,record)=>{
                // record 为当前行
                //@todo 请求借口呀来删除呢？
                return (
                    <Popconfirm title="确定要删除?" onConfirm={()=>onDelete(record.id)}>
                        <Button>删除</Button>
                    </Popconfirm>
                );
            }
        }
    ];

    return (
        <Table dataSource={products} columns={columns}></Table>
    );
}

ProductList.propTypes = {
    onDelete: PropTypes.func.isRequired,
    products: PropTypes.array.isRequired
};

export default ProductList;